<!-- Bootstrap -->
<link href="__CONSOLE__/vendors/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom Theme Style -->
<link href="__CONSOLE__/build/css/custom.min.css" rel="stylesheet">
<!-- Select2 -->
<link href="__PLUGIN__/select2/dist/css/select2.css" rel="stylesheet">
<link href="__PLUGIN__/select2/dist/css/select2.min.css" rel="stylesheet">
<!-- Switchery -->
<link href="__CONSOLE__/vendors/switchery/dist/switchery.min.css" rel="stylesheet">

<!-- Font Awesome -->
<link href="__CONSOLE__/vendors/font-awesome/css/font-awesome.min.css" rel="stylesheet">
<!-- iCheck -->
<link href="__CONSOLE__/vendors/iCheck/skins/flat/green.css" rel="stylesheet">
<!-- bootstrap-wysiwyg -->
<link href="__CONSOLE__/vendors/google-code-prettify/bin/prettify.min.css" rel="stylesheet">

<!-- Switchery -->
<link href="__CONSOLE__/vendors/switchery/dist/switchery.min.css" rel="stylesheet">
<!-- starrr -->
<link href="__CONSOLE__/vendors/starrr/dist/starrr.css" rel="stylesheet">
<!-- 必须在图片实例化之前 -->
<script src="__CONSOLE__/vendors/image-upload/plupload.full.min.js"></script>
<script src="__CONSOLE__/vendors/uploadPreview.js"></script>
<link rel="stylesheet" href="__CONSOLE__/icheck-bootstrap.css">
<!--<script src="__CONSOLE__/jquery-validation-1.14.0/jquery.js"></script>-->
<!--<script src="__CONSOLE__/jquery-validation-1.14.0/jquery.validate.min.js"></script>-->
<!--<script src="__CONSOLE__/jquery-validation-1.14.0/messages_zh.js"></script>-->
<!--<script src="https://static.runoob.com/assets/jquery-validation-1.14.0/dist/jquery.validate.min.js"></script>-->
<script src="__CONSOLE__/jquery-validation-1.14.0/jquery.js"></script>
<script src="__CONSOLE__/jquery-validation-1.14.0/jquery.validate.min.js"></script>
<script src="__CONSOLE__/jquery-validation-1.14.0/messages_zh.js"></script>
<!--oss-->
<link rel="stylesheet" type="text/css" href="__PLUGIN__/oss-h5/style.css"/>
<script type="text/javascript" src="__PLUGIN__/oss-h5/lib/crypto1/crypto/crypto.js"></script>
<script type="text/javascript" src="__PLUGIN__/oss-h5/lib/crypto1/hmac/hmac.js"></script>
<script type="text/javascript" src="__PLUGIN__/oss-h5/lib/crypto1/sha1/sha1.js"></script>
<script type="text/javascript" src="__PLUGIN__/oss-h5/lib/base64.js"></script>
<script type="text/javascript" src="__PLUGIN__/oss-h5/lib/plupload-2.1.2/js/plupload.full.min.js"></script>
<script type="text/javascript" src="__PLUGIN__/oss-h5/upload.js"></script>

<!--oss-->
<script>
    $.validator.setDefaults({
        submitHandler: function() {
            //alert("提交事件!");
            form.submit();
        }
    });
    $().ready(function() {
        $("#commentForm").validate({debug:false,
            ignore: ".ignore",
            errorPlacement: function(error, element) {
            console.log(element);
                // Append error within linked label
                $( element )
                    .closest( "form" )
                    .find( "label[for='" + element.attr( "id" ) + "']" ).parent()
                    .append( error );
            }
        });
    });
</script>
<style>
    .error{
        color:red;
    }
</style>
<style>
     .alert {
        left: 0;
        opacity: 1;
    }
     .alert {
        float: left;
        margin: 0 0 0 20px;
        padding: 3px 10px;
        color: #FFF;
        border-radius: 3px 4px 4px 3px;
        background-color: #CE5454;
        max-width: 170px;
        white-space: pre;
        position: relative;
        left: -15px;
        opacity: 0;
        z-index: 1;
        transition: .15s ease-out;
    }
     input.error { border: 1px solid #CE5454; }
     label.error {
         float: left;
         margin: 0 0 0 20px;
         padding: 3px 10px;
         color: #FFF;
         border-radius: 3px 4px 4px 3px;
         background-color: #CE5454;
         max-width: 170px;
         white-space: pre;
         position: relative;
         left: -15px;
         opacity: 1;
         z-index: 1;
         transition: .15s ease-out;
         border: 1px solid transparent;

     }
     .item .error::after {
         content: '';
         display: block;
         height: 0;
         width: 0;
         border-color: transparent #CE5454 transparent transparent;
         border-style: solid;
         border-width: 11px 7px;
         position: absolute;
         left: -13px;
         top: 1px;
     }
     label.checked {
         background:url("./demo/images/checked.gif") no-repeat 0px 0px;
     }


     .panel-body {
         padding: 14px;

     }
     .btn {
         display: inline-block;
         padding: 6px 8px;
     }
     /*.thumbnail{width:154px;height: 144px}*/


</style>
<!-- css-->
<link rel="stylesheet" type="text/css" href="__PLUGIN__/webuploader/webuploader.css">
<link rel="stylesheet" type="text/css" href="__PLUGIN__/webuploader/bootstrap.css" />
<script type="text/javascript" src="__PLUGIN__/webuploader/webuploader.min.js"></script>
<!--文件上传js-->
<script>
    function file(input) {
        GUID = WebUploader.Base.guid();
        var uploader = WebUploader.create({
            // swf文件路径
            auto:true,
            swf : '__PLUGIN__/Uploader.swf',//这个好像普通的文件上传用不到
            // 文件接收服务端地址。
            server : '{:url("console/Upload/upload")}',
            formData:{name:GUID},
            // 内部根据当前运行是创建，可能是input元素，也可能是flash.
            pick : '#'+input+'_select',
            chunked: true,  //分片处理
            chunkSize: 10 * 1024 * 1024, //每片10M
            threads:5,//上传并发数。允许同时最大上传进程数。
            // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
            resize : false,
        });
        // 当有文件被添加进队列的时候
        uploader.on( 'fileQueued', function( file ) {
            // $("#thelist").append( '<div id="' + file.id + '" class="item">' +
            //     '<h4 class="info">' + file.name + '</h4>' +
            //     '<p class="state">等待上传...</p>' +
            //     '</div>' );
        });

        $("#btnSync").on('click', function() {
            if ($(this).hasClass('disabled')) {
                return false;
            }
            uploader.options.formData.guid = Math.random();
            uploader.upload();

        });
        uploader.on('uploadProgress', function(file,percentage) {
            console.log(file);
            console.log(percentage);
            console.log(input);
            $("#"+input+"_progress").css("width",parseInt(percentage*100)+"%");
            $("#"+input+"_progress").html(parseInt(percentage*100)+"%");
        });
        uploader.on('uploadSuccess', function(file,response) {
            // alert(uploader.options.formData.guid);
            // alert(Math.ceil(file.size/(10*1024*1024)));
            console.log(response.result.info.filePaht);
            $('[name="'+input+'"]').val(response.result.info.filePaht);
            $('#' + file.id).find('p.state').text('已上传');
            // $.post('{:url("Upload/upload")}', { "guid": uploader.options.formData.guid,chunks:Math.ceil(file.size/(10*1024*1024)),name:file.name},
            //     function(data){
            //
            //     }, "json");
        });
        uploader.on('uploadError', function(file) {
            $('#' + file.id).find('p.state').text('上传出错');
        });

        uploader.on('uploadComplete', function(file) {
            console.log(file);
            $('#' + file.id).find('.progress').fadeOut();
        });
    }
</script>


